package com.moonshineproject.plugin.menu.renderers
{
	import com.moonshineproject.plugin.menu.MenuModel;
	import com.moonshineproject.plugin.menu.interfaces.ICustomMenuItem;
	import com.moonshineproject.utils.moonshine_internal;
	
	import flash.display.Graphics;
	import flash.display.Shape;
	import flash.events.MouseEvent;
	
	import mx.containers.HBox;
	import mx.core.UIComponent;
	import mx.core.mx_internal;
	
	import spark.components.Label;
	import spark.primitives.Graphic;


	use namespace moonshine_internal;

	public class MenuItemRenderer extends UIComponent
	{
	

		private var shortcutView:Label
		private var labelView:Label
		private var arrowClip:UIComponent

		private var checkBoxGap:UIComponent
		private var container:HBox
		private var rollOverShape:Shape

		private var verticalLine:Shape

		private var updateShortcut:Boolean
		private var needsRedrawing:Boolean = false;
		private var separatorLine:Shape

		
		private const RENDERER_AS_SPERATOR_HEIGHT:int = 10;
		private const RENDERER_HEIGHT:int = 22;		

		private const MIN_WIDTH:int = 160;
		

		private const LABEL_PADDING:int = 5;

		private const SUBMENU_ARROW_SECTION_WIDTH:int = 10;

		private const SUBMENU_ARROW_WIDTH:int = 4;
		private const SUBMENU_ARROW_HEIGHT:int = 7;

		private const EDGE_PADDING:int = 2;


		private var _label:String

		private var updateChildrenLayoutFlag:Boolean = false;

		public function set label(v:String):void
		{
			_label = v;
			if (labelView)
				labelView.text = v;
		}

		public function get label():String
		{
			return _label;
		}

		private var _data:ICustomMenuItem

		public function set data(v:ICustomMenuItem):void
		{
			_data = v;
		}

		public function get data():ICustomMenuItem
		{
			return _data;
		}

		private var _separator:Boolean

		public function set separator(v:Boolean):void
		{
			if (_separator != v)
			{
				_separator = v;
				needsRedrawing = true;
				invalidateProperties();
			}

		}

		private var _submenu:Boolean

		public function set submenu(v:Boolean):void
		{
			if (_submenu != v)
			{
				_submenu = v;
				if (arrowClip)
					arrowClip.visible = v;
			}

		}

		private var _shortcut:String

		public function set shortcut(v:String):void
		{
			if (_shortcut != v)
			{
				_shortcut = v;

				if (shortcutView)
					shortcutView.text = v;
			}
		}

		public function get shortcut():String
		{
			return _shortcut;
		}

		private var _model:MenuModel

		public function set model(v:MenuModel):void
		{
			_model = v;
		}

		public function MenuItemRenderer()
		{
			super();
			width = MIN_WIDTH;
			minWidth = MIN_WIDTH;
			height = RENDERER_HEIGHT;
			


		}

		moonshine_internal function resizeLabels(
			labelWidth:Number=NaN, shortcutWidth:Number=NaN):void
		{
			var newWidth:Number = 0;
			var oldLabelWidth:Number

			oldLabelWidth = labelView.width || labelView.measuredWidth;
			labelWidth = labelWidth != oldLabelWidth ? labelWidth : oldLabelWidth;


			labelView.width = labelWidth;
			newWidth += labelWidth;

			oldLabelWidth = shortcutView.width || shortcutView.measuredWidth;
			shortcutWidth = shortcutWidth != oldLabelWidth ? shortcutWidth : oldLabelWidth;

			shortcutView.width = shortcutWidth;
			newWidth += shortcutWidth;

			newWidth += checkBoxGap.width;
			newWidth += arrowClip.width
			newWidth += EDGE_PADDING * 2 // container left/right padding

			newWidth = Math.round(newWidth);

			if (width != newWidth)
			{
				needsRedrawing = true;
				width = container.width = newWidth;
			}

		}


		private function getPaddingWidth(target:UIComponent):Number
		{
			var total:Number = 0;
			total += target.getStyle("paddingLeft") || 0;
			total += target.getStyle("paddingRight") || 0;
			return total;
		}

		moonshine_internal function getLabelWidth():Number
		{
			return getLabelWidth(labelView);
		}



		moonshine_internal function getShortcutLabelWidth():Number
		{
			if (!_shortcut)
				return 0;
			return getLabelWidth(shortcutView)
		}

		private function getLabelWidth(label:Label):Number
		{
			if (!label)
				return 0;
			use namespace mx_internal;
			return label.bounds.width;
		}


		private function drawItemState():void
		{

			height = _separator ? RENDERER_AS_SPERATOR_HEIGHT : RENDERER_HEIGHT
			shortcutView.visible = shortcutView.includeInLayout = !_separator;
			labelView.includeInLayout = labelView.visible = !_separator;
			arrowClip.visible = !_separator && _submenu;
			separatorLine.visible = _separator;
			needsRedrawing = false;
		}




		override protected function createChildren():void
		{
			super.createChildren();

			var g:Graphics;

			rollOverShape = new Shape();
			rollOverShape.alpha = 0; // use alpha instead of visible so we can capture the roll over/out events
			addChild(rollOverShape);


			separatorLine = new Shape();
			addChild(separatorLine);



			container = new HBox();
			setProps(container, {
					verticalGap:0,
					horizontalGap:0,
					paddingLeft:EDGE_PADDING,
					paddingRight:EDGE_PADDING
				});

			container.horizontalScrollPolicy = "none";
			container.percentWidth = 100;
			container.minWidth = width;
			container.width = width;

			container.height = RENDERER_HEIGHT;
			container.mouseChildren = false;
			container.mouseEnabled = false;


			addChild(container);

			checkBoxGap = new UIComponent();
			checkBoxGap.width = 28;
			g = checkBoxGap.graphics;
			g.beginFill(0xe2e3e3);
			g.drawRect(checkBoxGap.width - 2, 0, 2, RENDERER_HEIGHT);
			g.beginFill(0xffffff);
			g.drawRect(checkBoxGap.width - 1, 0, 1, RENDERER_HEIGHT);
			g.endFill();
			container.addChild(checkBoxGap);

			labelView = createLabel(_label);
			labelView.setStyle("paddingRight", 25);
			container.addChild(labelView);



			shortcutView = createLabel(_shortcut);
			shortcutView.setStyle("paddingRight", 5);
			shortcutView.setStyle("textAlign", "right");
			container.addChild(shortcutView);





			arrowClip = new UIComponent();
			arrowClip.width = 13;
			

			var yStartPos:Number = height / 2 - SUBMENU_ARROW_HEIGHT / 2;
			g = arrowClip.graphics;
			g.beginFill(0x333333);
			g.moveTo(0, yStartPos);
			g.lineTo(SUBMENU_ARROW_WIDTH, yStartPos + (SUBMENU_ARROW_HEIGHT / 2));
			g.lineTo(0, yStartPos + SUBMENU_ARROW_HEIGHT)
			g.lineTo(0, yStartPos);
			g.endFill();

			arrowClip.visible = _submenu;

			container.addChild(arrowClip);



			drawItemState();
			addEventListener(MouseEvent.ROLL_OUT, rollOutHandler);
			addEventListener(MouseEvent.ROLL_OVER, rollOverHandler);
		}

		private function setProps(target:UIComponent, props:Object):void
		{
			var prop:String
			for (prop in props)
				target.setStyle(prop, props[prop]);
		}

		private function createLabel(text:String):Label
		{
			var label:Label = new Label();
			label.text = text;
			label.height = RENDERER_HEIGHT;
			label.minWidth = 50;
			label.mouseChildren = false;
			label.mouseEnabled = false;			
		
			setProps(label, {
					paddingLeft:6,
					lineHeight:12,
					lineBreak:"explicit",
					color:0x333333,
					paddingTop:(RENDERER_HEIGHT / 2 - 12 / 2)+1

				});

			return label;
		}

		override protected function commitProperties():void
		{
			super.commitProperties();
			if (needsRedrawing)
			{
				needsRedrawing = false;
				drawItemState();
			}
		}



		private function rollOutHandler(e:MouseEvent):void
		{
			if (!_separator)
				rollOverShape.alpha = 0
		}

		private function rollOverHandler(e:MouseEvent):void
		{
			if (!_separator)
				rollOverShape.alpha = 1;
		}

		override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
		{
			super.updateDisplayList(unscaledWidth, unscaledHeight);
			var g:Graphics=rollOverShape.graphics;
			g.clear();
			g.beginFill(0xddecf3, .7);
			g.lineStyle(1, 0xa8d8eb, .7, true, "normal", "round");
			g.drawRoundRect(2, 0, unscaledWidth - 4, height, 6, 6);
			g.endFill();

			var sepOffset:Number = EDGE_PADDING+checkBoxGap.width;
			var sepWidth:Number =unscaledWidth-sepOffset-2;
			var sepXOffset:Number = (unscaledHeight/2 - 2/2)+1;
			g=separatorLine.graphics;
			g.clear();
			g.beginFill(0xe2e3e3);
			g.drawRect(sepOffset,sepXOffset,sepWidth,2);
			g.beginFill(0xffffff);
			g.drawRect(sepOffset,sepXOffset+1,sepWidth,1);
			g.endFill();
			
		}




	}
}